<template>
    <view class="u-p-t-28 main-pd">
        <view class="u-flex">
          <view class="tab-con u-m-r-16" @click="goUrl('/pagesB/yzzz/apply')">
            <u-image src="@/static/images/tabbg3.png" width="335rpx" height="124rpx" radius="12rpx"></u-image>
            <view class="tab-msg">
              <view class="tab-title"> 申请成立业委会 </view>
              <u-image src="@/static/images/icon11.png" width="32rpx" height="32rpx"></u-image>
            </view>
          </view>
          <view class="tab-con" @click="goUrl('/pagesB/yzzz/ywhcy')">
            <u-image src="@/static/images/tabbg4.png" width="335rpx" height="124rpx" radius="12rpx"></u-image>
            <view class="tab-msg">
              <view class="tab-title"> 查看业委会成员 </view>
              <u-image src="@/static/images/icon11.png" width="32rpx" height="32rpx"></u-image>
            </view>
          </view>
        </view>
        <view class="u-m-t-32">
             <HeadTitle title="业主大会">
                <view @click="goUrl('/pagesB/yzzz/yzdhList')"><u-text suffixIcon="arrow-right" color="#bfbfbf" text="查看更多" :iconStyle="{
                    fontSize: '28rpx', color: '#bfbfbf'
                }"></u-text></view>
              </HeadTitle>
        </view>
        <view class="u-m-t-20">
            <view class="u-card" v-show="yzdhList.length">
                <view class="list-item" v-for="item in yzdhList" :key="item.id" @click="$u.route('/pagesB/yzzz/yzdhDetail?id='+item.id)">
                    <view class="u-flex font-32 u-m-b-16">
                        <view class="color-595959">大会标题：</view>
                        <view class="color-333">{{item.title}}</view>
                    </view>
                    <view class="u-flex font-32">
                        <view class="color-595959">大会时间：</view>
                        <view class="color-333">{{item.createTime}}</view>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script setup>
import { ref } from "vue"
import HeadTitle from "@/components/HeadTitle.vue";
import {getyzdhListApi} from "@/api/index"
import {onLoad} from "@dcloudio/uni-app"
let yzdhList = ref([])
const getyzdhListHandle = ()=>{
    getyzdhListApi({
        page:1,
        limit:3
    }).then(res=>{
        if(res.success){
            yzdhList.value = res.data
        }
    })
}
const goUrl = (url)=>{
    uni.$u.route(url)
}
onLoad(()=>{
    getyzdhListHandle()
})
</script>

<style lang="scss" scoped>
.tab-con {
  position: relative;
  width: 335rpx;
  height: 124rpx;
}

.tab-msg {
  width: 100%;
  position: absolute;
  top: 38rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 26rpx;
  box-sizing: border-box;
}

.tab-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #ffffff;
}
</style>
